<template>
  <a-modal
    v-model:visible="visible"
    title="新增供货商信息"
    @ok="execAdd"
    @cancel="closeAdd"
  >
    <!-- 新增窗口 -->
    <a-form
      :model="addObj"
      :label-col="{ span: 5 }"
      :wrapper-col="{ span: 14 }"
      :rules="rules"
      ref="checkdata"
    >
      <a-form-item label="供货商编号" name="su_id">
        <a-input v-model:value="addObj.su_id" />
      </a-form-item>
      <a-form-item label="供货商名称" name="su_name">
        <a-input v-model:value="addObj.su_name" />
      </a-form-item>
      <a-form-item label="供货商电话" name="su_tel">
        <a-input v-model:value="addObj.su_tel" />
      </a-form-item>
      <a-form-item label="供货商负责人" name="su_person">
        <a-input v-model:value="addObj.su_person" />
      </a-form-item>
    </a-form>
  </a-modal>
</template>
<script>
import { ref, reactive } from "vue";
import { get, put, post, tip, del } from "@/common";
export default {
  setup(props, { emit }) {
    const closeAdd = () => {
      checkdata.value.resetFields();
    };
    const checkdata = ref();
    const rules = {
      su_id: [
        {
          required: true,
          message: "请输入供货商编号！",
          trigger: "blur",
        },
        {
          min: 3,
          max: 10,
          message: "账号必须为3~10个字符构成！",
          trigger: "blur",
        },
      ],
      su_name: [
        {
          required: true,
          message: "请输入供货商名称",
          trigger: "blur",
        },
      ],
      su_tel: [
        {
          required: true,
          message: "请输入供货商电话",
          trigger: "blur",
        },
        {
          pattern: /^((0\d{2,3}-\d{7,8})|(1[34578]\d{9}))$/,
          message: "请输入正确的电话格式",
          trigger: "blur",
        },
      ],
      su_person: [
        {
          required: true,
          message: "请输入供货商负责人",
          trigger: "blur",
        },
      ],
    };
    const addObj = reactive({
      su_id: "",
      su_name: "",
      su_tel: "",
      su_person: "",
    });
    const visible = ref(false);
    const openAdd = () => {
      visible.value = true;
    };
    const execAdd = () => {
      checkdata.value
        .validate()
        .then(() => {
          post("/stock/supplier", addObj).then((res) => {
            checkdata.value.resetFields();
            visible.value = false;
            tip.success("新增成功");
            emit("flash");
          });
        })
        .catch((error) => {
          tip.error("输入信息缺失或格式错误！");
        });
    };
    return {
      openAdd,
      addObj,
      visible,
      execAdd,
      rules,
      checkdata,
      closeAdd,
    };
  },
};
</script>
<style scoped>
</style>
